<template>
  <el-main style="padding: 20px">
    <el-button type="primary" size="mini" icon="el-icon-plus" @click="tianjia = true">
      添加
    </el-button>
    <!-- 组合习题 -->
    <el-dialog :visible.sync="AddtEaxm" width="80%">
      <el-radio-group v-model="radio" style="margin-top: 20px" v-if="typeList">
        <el-radio
          :label="item.categoryCode"
          v-for="(item, index) in typeList"
          :key="index"
          >{{ item.categoryName }}</el-radio
        >
      </el-radio-group>
      <el-table :data="ExamList" style="width: 100%" @selection-change="selectEaxm">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column prop="content" label="题目"></el-table-column>
        <el-table-column
          prop="type"
          label="类型（1-选择 2-填空 3-简答 4-判断 5-多选 6-计算 7-论叙 8-操作）"
        ></el-table-column>
      </el-table>
      <el-pagination
        background
        layout="prev, pager, next"
        :page-count="ExamData.pages"
        :current-page="Examcur"
        @current-change="ExamQie"
      ></el-pagination>
      <div style="text-align: right">
        <el-button type="primary" size="mini" @click="tanchuExam()"> 确认选中 </el-button>
      </div>
    </el-dialog>
    <el-dialog
      title="请填写分数"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose"
    >
      <el-input v-model="point" placeholder="默认为1分"></el-input>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="okExam">确 定</el-button>
      </span>
    </el-dialog>

    <div class="table-box">
      <el-table :data="course" style="width: 100%">
        <el-table-column prop="chapterName" label="章节"></el-table-column>
        <el-table-column prop="crtDate" label="日期"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <!-- <el-button @click="addWord(scope.row)" type="text" size="mini"
              >组合习题</el-button
            > -->
            <el-button @click="showEditView(scope.row)" type="text" size="mini"
              >查看</el-button
            >
            <el-button @click="setbianji(scope.row)" type="text" size="mini"
              >编辑</el-button
            >
            <el-button @click="addzhang(scope.row)" type="text" size="mini"
              >添加小节</el-button
            >
            <el-button type="text" size="mini" @click="deleteObj(scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        background
        layout="prev, pager, next"
        :page-count="dailyData.pages"
        :current-page="dailyCur"
        @current-change="dailyQie"
      ></el-pagination>
    </div>

    <el-dialog :visible.sync="showAddView" width="30%">
        类别名称：<el-input v-model="inputtext" style="width:30%" placeholder="请输入内容"></el-input>
      <el-button type="primary" size="mini" style="margin-top:5%" @click="setData()"> 修改 </el-button>
    </el-dialog>

    <el-dialog :visible.sync="SHowname" width="40%">
      <el-form class="demo-ruleForm">
        <el-form-item label="名称">
          <el-input
            prefix-icon="el-icon-edit"
            v-model="xiaoname"
            size="mini"
            placeholder="请输入名称"
          ></el-input>
        </el-form-item>
      </el-form>
      <el-button type="primary" size="mini" @click="addxiaojie()"> 添加 </el-button>
    </el-dialog>

    <el-dialog :visible.sync="tianjia" width="40%">
      <el-form class="demo-ruleForm">
        <el-row style="width: 50%">
          <el-form-item label="名称:" prop="className">
            <el-input
              prefix-icon="el-icon-edit"
              v-model="ZhangjieName"
              size="mini"
              placeholder="请输入章节名称"
            ></el-input>
          </el-form-item>
        </el-row>
        <!-- <el-form-item label="科目">
          <el-select placeholder="请选择科目" v-model="val2">
            <el-option
              v-for="(item, index) in course"
              :key="index"
              :label="item.chapterName"
              :value="item.chapterId"
            >
              {{ item.chapterName }}
            </el-option>
          </el-select>
        </el-form-item> -->
      </el-form>
      <el-button type="primary" size="mini" @click="addData()"> 添加 </el-button>
    </el-dialog>

     <el-dialog :visible.sync="fencard" width="40%">
      <el-form class="demo-ruleForm">
        <div class="block">
          <span class="demonstration">选择分类</span>
          <el-cascader
            v-model="val2"
            :options="toplist"
            @change="handleChange"
            :props="listchange"
          ></el-cascader>
        </div>
      </el-form>
      <el-button type="primary" size="mini" @click="addType()"> 确定 </el-button>
    </el-dialog>
  </el-main>
</template>

<script>
export default {
  data() {
    return {
      fencard:false,
      ZhangjieName: "",
      inputtext:'',
      listchange: {
        label: "className",
        value: "classId",
      },
      dailyCur: 1,
      radio: 1,
      subjectId: 1,
      dialogVisible: false,
      showAddView: false,
      SHowname: false,
      value: "",
      val2: "",
      tianjia: false,
      course: [],
      list: [],
      testid: 1,
      page: 1,
      size: 10,
      examPage: 1,
      examSize: 10,
      AddtEaxm: false,
      ExamList: [],
      ExamData: [],
      Examcur: 1,
      selectAdd: [],
      point: "",
      typeList: [],
      dailyData: [],
      currentPage: 1,
      toplist: [],
      nowlist: {},
      xiaoname: "",
      nowname:'',
      chapterId:'',
      leimuid:'',
      classId:''
    };
  },
  inject: ["reload"],
  mounted() {
    this.chapterId = this.$route.query.id
        this.leimuid = this.$route.query.leimuid
      this.classId = this.$route.query.classId
      //console.log("cla",this.classId)
    // this.queryCourse().then(this.getdata);
    // this.getType();
    // this.getFenlei();
    // this.getlists();
	
	console.log(this.chapterId)
      this.charlist()
  },
  watch: {
    radio() {
      this.page = 1;
      this.getEaxm();
    },
  },
  methods: {
	  charlist(){
		  this.postJson("/back/chapter/queryPracticeChapterList",{
		        pchapterId:this.chapterId
		      }).then((res) => {
		    this.course = res.data.data
		    this.$message(res.data.msg);
		  		console.log(res)
		  });
	  },
    addType(){
      this.fencard=false;
      this.queryCourse()
    },
    addxiaojie() {
      let model = {
        chapterId: this.nowlist.chapterId,
        name: this.xiaoname,
      
      };
      this.postJson("/back/unit/addPracticeUnit", model).then((res) => {
             this.reload();
              this.$message(res.data.msg);
      });
    },
    //添加小节
    addzhang(msg) {
      this.nowlist = msg;
      this.SHowname = !this.SHowname;
    },
    //列表展示
    getlists() {
      this.postRequest(
        "/back/class/queryPracticeClassList?pageNo=" + this.currentPage + "&pageSize=20"
      ).then((res) => {
        this.toplist = res.data.data;
        //console.log("1231232132", this.toplist);
      });
    },
    //选择结果
    handleChange(e) {
      //console.log(e);
      for(let i =0;i<this.toplist.length;i++){
        if(e[0]==this.toplist[i].classId){
          this.nowname = this.toplist[i].children[0].className
        }
      }
    },
    getFenlei() {
      this.postRequest(
        "/back/class/queryPracticeClassList?pageNo=" + this.currentPage + "&pageSize=20"
      ).then((res) => {
        this.toplist = res.data.data;
      });
    },
    getType() {
      this.postRequest("/comm/queryCategoryByType", { type: "practice_type" }).then(
        (res) => {
          //console.log(res);
          this.typeList = res.data.data;
          this.radio = this.typeList[0].categoryCode;
        }
      );
    },
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then((_) => {
          done();
        })
        .catch((_) => {});
    },
    okExam() {
      if (this.point == "") {
        this.point = 1;
      }
      let list = [];
      let that = this;
      this.selectAdd.forEach((item) => {
        let obj = {
          practiceId: item.practiceId,
          point: that.point,
        };
        list.push(obj);
      });
      //console.log(list);
      let listNew = [];
      this.postRequest(`/back/practicetest/getPracticeTest?testId=${this.examId}`).then(
        (res) => {
          listNew = res.data.data.content;
          let arr = [];
          for (var item in listNew) {
            arr = arr.concat(listNew[item]);
          }
          //console.log(arr);
          arr.forEach((item) => {
            list.push({ practiceId: item.practiceId, point: item.point });
          });
          that
            .postJson(`/back/practicetest/addTestContent?testId=${that.examId}`, list)
            .then((res) => {
              //console.log(res);
              that.reload();
              that.$message(res.data.msg);
            });
        }
      );
      //console.log(list);
    },
    tanchuExam() {
      //console.log(this.selectAdd);
      this.dialogVisible = true;
    },
    dailyQie(val) {
      //console.log(val);
      this.page = val;
      this.getdata();
    },
    ExamQie(val) {
      //console.log(val);
      this.examPage = val;
      this.getEaxm();
    },
    getEaxm() {
      return
      let params = {
        page: this.examPage,
        size: this.examSize,
        subjectId: this.subjectId,
        type: this.radio,
      };
      this.postRequest(`/back/practicestores/queryPracticeList`, params).then((res) => {
        this.ExamList = res.data.data.list;
        this.ExamData = res.data.data;
        //console.log(res);
      });
    },
    selectEaxm(e) {
      //console.log(e);
      this.selectAdd = e;
    },
    addWord(e) {
      //console.log(e);
      this.subjectId = e.subjectId;
      this.getEaxm();
      (this.examId = e.testId), (this.AddtEaxm = true);
    },
    handleSelectionChange(val) {
      //console.log(val);
      this.multipleSelection = val;
    },
    setbianji(data) {
      this.testid = data.typeId;
      this.inputtext = data.typeName
      this.showAddView = !this.showAddView;
    },
    // 删除,批量删除已逗号隔开
    deleteObj(e) {
		 let obj = e.chapterId
       this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              }).then(() => {
				  this.postRequest(`/back/chapter/delete`,{ids:obj}).then((res) => {
				    this.reload();
				   this.$message({
				     type: 'success',
				     message: '删除成功!'
				   });
				   
				  });
              
              }).catch(() => {
                this.$message({
                  type: 'info',
                  message: '已取消删除'
                });          
              });
     
     
    },
    addData() {
      
      let model = {
         classId:this.classId,
        pchapterId: this.chapterId,
        chapterName: this.ZhangjieName,
      };
      this.postJson("/back/chapter/addPracticeChapter", model).then((res) => {
        //console.log(res);
        this.$message(res.data.msg);
        this.reload();
         this.postJson("/back/chapter/queryPracticeChapterList", {
            pchapterId:this.chapterId
         }).then((res) => {
        this.course = res.data.data
        this.$message(res.data.msg);
        this.reload();
        
      });
      });
    },
    showEditView(shu) {
      // console.log("shu",shu);
      // 获取每日一练详情
      this.$router.push({ path: "/Xiaojie?id=" + this.chapterId+'&chapterId='+shu.chapterId +'&leimuid='+this.leimuid });
    },
    setData() {
    let params = { typeId: this.testid,
      typeName:this.inputtext
       };
             this.postJson(
        `/back/practicetest/updatePracticeTest`,
        params
      ).then((res) => {
        this.$message(res.data.msg);
        this.reload();
      });
    },
    queryCourse() {
      let that = this;
      let obj=that.val2[1]
      return new Promise(function (next, err) {
        that.postJson("/back/chaptertype/queryListByClassId",obj).then((res) => {
          //console.log(res);
          that.course = res.data.data;
          next();
        });
      });
    },
    getdata() {
      let that = this;
      let params = { page: this.page, size: this.size };
      return new Promise(function (next, err) {
        // that.postRequest('/back/practicetest/queryPracticeTestList', params).then(res => {
        that
          .postRequest("/back/practicetest/queryPracticeTestList", params)
          .then((res) => {
            //console.log(res);
            that.dailyData = res.data.data;
            that.list = res.data.data.list;
            that.list.forEach((item) => {
              //console.log(item);
              that.course.forEach((value) => {
                //console.log(value);
                if (item.chapterId == value.chapterId) {
                  item.kemu = value.chapterName;
                }
              });
            });
            next();
          });
      });
    },
  },
};
</script>

<style>
/* POST /back/circleinfos/query */
</style>
<!-- postRequest -->
